<template>
	<view class="wode">
		<!-- //弹出层 -->
		<u-modal :show="show" :title="title" confirmColor="#2ACC9C"  :showCancelButton='true'
			@confirm="jsconfirm" @cancel="show=false"></u-modal>
		<u-modal :show="cxshow" :title="cxtitle" confirmColor="#2ACC9C"  :showCancelButton='true'
			@confirm="cxconfirm" @cancel="cxshow=false"></u-modal>
		<!-- 个人信息 -->
		<view class="flexbetween mainpadding">
			<view class="flexleft" v-if="is_login">
				<view class="touxiang margin_right3">
					<image :src="wodelibiao.userinfo.avatar" mode=""></image>
				</view>
				<view class="rt">
					<view class="flexleft">
						<view class="bigtext margin_right1">{{wodelibiao.userinfo.nickname}}</view>
						<!-- 校园认证 -->
						<view class="xyrz" v-show="statustop==2">
							<view class="baisetext">校园认证</view>
						</view>
						<view class="shz" v-show="statustop==1">
							<view class="baisetext">审核中</view>
						</view>
						<view class="bbh" v-show="statustop==3" @click="bohui">
							<view class="baisetext">被驳回</view>
						</view>
						<!-- 禁言中 -->
						<!-- <view class="jinyz" @click="tzzhss">
							<view class="baisetext">禁言中</view>
						</view> -->
						<!-- 封号中 -->
						<view class="jinyz" v-show="wodelibiao.userinfo.status=='hidden'" @click="tzzhss">
							<view class="baisetext">封号中</view>
						</view>
						<!-- <view class="jinyz" @click="tzzhss">
							<view class="baisetext">封号中</view>
						</view> -->
					</view>	
					<view class="huisetext overflow_hidden margin_top" v-show="wodelibiao.userinfo.bio">
						{{wodelibiao.userinfo.bio}}
					</view>
				</view>
			</view>
			<view class="flexleft" v-if="!is_login" @click="getWeChatCode">
				<view class="touxiang margin_right3">
					<image src="../../static/image/system/ershouxz.png" mode=""></image>
				</view>
				<view class="bigtext">游客登陆</view>
			</view>
			<view class="tuyuan" @click="tzshezhi">
				<image src="../../static/image/system/tuoyuan.png" mode=""></image>
			</view>
		</view>
		<!-- 个人资料 -->
		<view class="gerebziliao mainpadding2">
			<view class="flexleft xiabiank mainpadding" @click="gerenzl">
				<view class="gerentu margin_right2"></view>
				<view class="titletext">个人资料</view>
			</view>
			<view class="flexleft xiabiank mainpadding" @click="tzsfyz">
				<view class="shenfyz margin_right2"></view>
				<view class="titletext">身份验证</view>
			</view>
		</view>
		<!-- 审核内容 -->
		<view class="mainpaddingzuoyou">
			<view class="flexbetween mainpaddingzuoyou margin_top" style="align-items: flex-start;">
				<view class="shenhebox" @click="jumpurl(0)">
					<view class="myicon">
						<image src="../../static/image/system/shangcz.png" mode=""></image>
					</view>
					<view class="strongtext">上线中</view>
					<view class="lvixan" v-show="jpp==0"></view>
				</view>
				<view class="shenhebox" @click="jumpurl(1)">
					<view class="myicon">
						<image src="../../static/image/system/yijs.png" mode=""></image>
					</view>
					<view class="strongtext">已结束</view>
					<view class="lvixan" v-show="jpp==1"></view>
				</view>
				<view class="shenhebox" @click="jumpurl(2)">
					<view class="myicon">
						<image src="../../static/image/system/daish.png" mode=""></image>
					</view>
					<view class="strongtext">被驳回</view>
					<view class="lvixan" v-show="jpp==2"></view>
				</view>
				<view class="shenhebox" @click="jumpurl(3)">
					<view class="myicon">
						<image src="../../static/image/system/quanbu.png" mode=""></image>
					</view>
					<view class="strongtext">全部</view>
					<view class="lvixan" v-show="jpp==3"></view>
				</view>
			</view>
		</view>
		<!-- 上线中 -->
		<view :class="item.check_status==4?'mainpadding xiahuaxian bgakground-posi':'mainpadding xiahuaxian'"  @click="shijixq(item.id)" v-for="item in list.data" :key="item.id">
			<view class="mainpaddingzuoyou" >
				<view class="nostrongtext">{{item.name + " " + item.content.replace(/[\r\n]/g, "")}}</view>
				<view class="flexleft margin_top" v-show="item.images.length && item.show==false"
					@click.stop="showimage(item)">
					<view class="photo margin_right1"></view>
					<view class="lansetext">{{item.images.length}}张图片</view>
				</view>
				<!-- 图片合集 -->
				<view class="flexleft flex_wrap" v-show="item.show">
					<view class="proview_images margin_top" v-for="ite in item.images" :key="ite">
						<image :src="ite" mode=""></image>
					</view>
				</view>
				<view class="flexleft margin_top2">
					<view class="lvsetext margin_right2">#{{item.topic.name}}</view>
					<view class="xiaohtext margin_right2">{{item.createtime_text}}</view>
					<view class="xiaohuitext">{{item.view_count}}人围观</view>
				</view>
				<view class="flexright margin_top">
					<view class="huangsetext margin_right2" v-show="item.check_status==3">被驳回！</view>
					<view class="huangsetext margin_right2" v-show="item.check_status==4">已结束</view>
					<view class="biglvtext margin_right2" v-show="item.check_status==2">上线中</view>
					<view class="lvsebtn" @click.stop="chongxinsx(item.id)" v-show="item.check_status==4">重新上线</view>
					<view class="margin_right2 huangsebtn" @click.stop="jieshu(item.id)" v-show="item.check_status==2">结束上线</view>
					<view v-if="item.is_refresh==1 &&item.check_status==2">
						<view class="shuaxinzhidbtn" @click.stop="sxzdbtn(item.id)">刷新置顶</view>
					</view>
				</view>
			</view>
		</view>
		<view class="zwnr" v-show="msgshow">
			暂无内容
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				wodelibiao: {
					userinfo: {
						avatar: "",
					}
				},
				is_login: false,
				jpp:0,
				listid:0,
				page: 1,
				limit: 12,
				list: {
					data: []
				},
				cxtitle: '是否重新上线',
				title: '是否结束上架？',
				show: false,
				cxshow: false,
				statustop:0,
				msgshow:false,
			}
		},
		onLoad(options) {
			if (options.token) {
				let token = options.token
				uni.setStorageSync('token', token);
			}
		},
		onShow() {
			this.is_login = httpRequest.checkIsLogin();
			this.mypage()
			if (this.is_login) {
				this.myjishi()
			}
		},
		methods: {
			myjishi(isPage, page){
				let state = 0
				let current = this.jpp
				let _this = this;
				if(current==0){
					state = 2
				}else if(current==1){
					state = 4
				}else if(current==2){
					state = 3
				}else{
					state = 0
				}
				httpRequest.request('user/forum_lists', 'POST', {
					page: page || 1,
					limit: _this.limit,
					state:state
				}, false, false, true).then(res => {
					// _this.list.data=[];
					if (res.code == 1) {
						console.log(res,666)
						if(res.data.data.length == 0){
							this.msgshow = true
						}else{
							this.msgshow = false
						}
						let resList = res.data;
						let dataList = _this.list;
						res.data.data.forEach(item => {
							Object.assign(item, {
								show: false
							})
						})
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							_this.list = resList
							_this.list.data = resList.data;
						}
						
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.myjishi(true, page);
			},
			// 结束
			jieshu(id) {
				this.listid = id
				this.show = true;
			},
			jsconfirm(){
				httpRequest.request('user/multi_status', 'POST', {
					state:4,
					forum_id:this.listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					this.myjishi()
				})
				this.show = false;
			},
			//重新上线
			chongxinsx(id) {
				this.listid = id
				this.cxshow = true;
			},
			cxconfirm(){
				httpRequest.request('user/multi_status', 'POST', {
					state:2,
					forum_id:this.listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					this.myjishi()
				})
				this.cxshow = false;
			},
			shijixq(id) {
				let msg = {
					detailid:id,//列表id
					plid:""//评论id
				}
				uni.navigateTo({
					url: '/pages/jishi/xiangqingsj?idjpp='+encodeURIComponent(JSON.stringify(msg))
				})
			},
			// 展示图片
			showimage(item) {
				item.show = true
			},
			// 刷新置顶
			sxzdbtn(id){
				httpRequest.request('user/refresh', 'POST', {
					forum_id:id
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
				})
			},
			// h5微信授权登录
			/*微信登录相关  start*/
			//方法：用来判断是否是微信内置的浏览器
			isWechat() {
				return String(navigator.userAgent.toLowerCase().match(/MicroMessenger/i)) === "micromessenger";
			},
			//请求微信接口，用来获取code
			getWeChatCode() {
				let local = encodeURIComponent(window.location.href); //获取当前页面地址作为回调地址
				console.log(local,'llllll');
				window.location.href = 'http://xiaoyuanjishi.yuntaiqi.com/api/user/auth?target_url=' + local
			},

			// 我的页面个人信息
			mypage() {
				httpRequest.request('user/index', 'POST', {}, false, false, true).then(res => {
					console.log(res.data)
					this.wodelibiao = res.data
					if(res.data.userinfo){
						this.statustop = res.data.userinfo.certification.state
					}else{
						this.statustop = 0
					}
					
				})
			},
			jumpurl(index) {
				this.jpp = index
				this.myjishi()
				// 如果用户未登录点击去登陆
				// if (!httpRequest.checkIsLogin()) {
				// 	httpRequest.doLogin();
				// 	return false;
				// }
				// uni.navigateTo({
				// 	url: "/pages/wode/wodetiezi?msg=" + index
				// })
			},
			bohui(){
				httpRequest.toast(this.wodelibiao.userinfo.certification.refuse_reason)
			},
			// 跳转申诉
			tzzhss(){
				uni.navigateTo({
					url: "/pages/wode/shensu"
				})
			},
			//跳转身份验证
			tzsfyz() {
				uni.navigateTo({
					url: "/pages/wode/shenfenyz"
				})
			},
			//跳转 个人资料
			gerenzl() {
				uni.navigateTo({
					url: "/pages/wode/gerenziliao"
				})
			},
			//跳转设置页面
			tzshezhi() {
				uni.navigateTo({
					url: "/pages/wode/shezhi"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.proview_images {
		width: 110rpx;
		height: 80rpx;
		border-radius: 10rpx;
		margin-right: 10rpx;
		image {
			width: 100%;
			height: 100%;
			border-radius: 10rpx;
		}
	}
	.bgakground-posi{
		background-image: url("@/static/image/system/over.png");
		background-position: 90% 20%;
		background-repeat: no-repeat;
		background-size: 170rpx 140rpx;
	}
	.lvsebtn{
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: MicrosoftYaHei-Bold-, MicrosoftYaHei-Bold;
		font-weight: normal;
		color: #FFFFFF;
		width: 142rpx;
		height: 65rpx;
		border-radius: 20rpx;
		background: #2ACC9C;
	}
	.huangsetext{
		font-size: 24rpx;
		font-family: MicrosoftYaHei-Bold-, MicrosoftYaHei-Bold;
		font-weight: normal;
		color: #FF7800;
	}
	.shuaxinzhidbtn{
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: MicrosoftYaHei-Bold-, MicrosoftYaHei-Bold;
		font-weight: normal;
		color: #FFFFFF;
		width: 142rpx;
		height: 65rpx;
		border-radius: 20rpx;
		background: #0096FF;
		
	}
	.huangsebtn{
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: MicrosoftYaHei-Bold-, MicrosoftYaHei-Bold;
		font-weight: normal;
		color: #FFFFFF;
		width: 142rpx;
		height: 65rpx;
		background: #FF7800;
		border-radius: 20rpx;
	}
	.biglvtext{
		font-size: 24rpx;
		font-family: MicrosoftYaHei-Bold-, MicrosoftYaHei-Bold;
		font-weight: normal;
		color: #2ACC9C;
	}
	.xiaohuitext{
		font-size: 20rpx;
		font-family: MicrosoftYaHei-, MicrosoftYaHei;
		font-weight: normal;
		color: #999999;
	}
	.xiaohtext{
		font-size: 20rpx;
		font-family: MicrosoftYaHei-, MicrosoftYaHei;
		font-weight: normal;
		color: #333333;
	}
	.lvsetext{
		font-size: 20rpx;
		font-family: MicrosoftYaHei-, MicrosoftYaHei;
		font-weight: normal;
		color: #2ACC9C;
	}
	.lansetext{
		font-size: 20rpx;
		font-family: MicrosoftYaHei-, MicrosoftYaHei;
		font-weight: normal;
		color: #8CCDFF;
	}
	.mainpaddingzuoyou{
		margin: 0 30rpx;
	}
	.xiahuaxian{
		border-bottom: 1rpx solid #EBEBEB;
	}
	.jinyz{
		background: #FF6565 ;
		border-radius: 10rpx;
		padding: 3rpx 6rpx;	
	}
	.baisetext{
		font-size: 24rpx;
		font-family: MicrosoftYaHei-, MicrosoftYaHei;
		font-weight: normal;
		color: #FFFFFF;
	}
	.xyrz{
		background: #2ACC9C;
		border-radius: 10rpx;
		padding: 3rpx 6rpx;	
	}
	.shz{
		background: #0096FF;
		border-radius: 10rpx;
		padding: 3rpx 6rpx;	
	}
	.bbh{
		background: #FF6565;
		border-radius: 10rpx;
		padding: 3rpx 6rpx;	
	}
	.lvixan {
		width: 51rpx;
		height: 9rpx;
		background: #2ACC9C;
		margin: 10rpx auto 0;
		border-radius: 5rpx 5rpx 5rpx 5rpx;
	}
	.zwnr{
		padding-top: 150rpx;
		text-align: center;
	}
	.shenfyz {
		background-size: 100% 100%;
		width: 40rpx;
		height: 31.5rpx;
		background-image: url('@/static/image/system/shenfyz.png');
	}

	.xiabiank {
		border-bottom: 1rpx solid #EBEBEB;
	}

	.overflow_hidden {
		max-width: 350rpx;
		overflow: hidden;
		/* 限制一行显示 */
		white-space: nowrap;
		/* 显示不下省略号显示 */
		text-overflow: ellipsis;
	}
	.gerentu {
		background-image: url('@/static/image/system/wogerenziliao.png');
		width: 38rpx;
		background-size: 100% 100%;
		height: 40rpx;
	}

	.myicon {
		width: 55rpx;
		height: 55rpx;
		margin: 0 auto 13rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.tuyuan {
		width: 51rpx;
		height: 45rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.huisetext {
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #999999;
	}

	.touxiang {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;

		image {
			border-radius: 50%;
			width: 100%;
			height: 100%;
		}
	}
</style>
